@ts-nocheck
<template>
  <el-table :data="sourceData" size="" style="width: 100%" stripe border :cell-style="{ padding: 0 }">
    <el-table-column prop="route" label="程序/航线" sortable width="120" resizable align="center">
    </el-table-column>
    <el-table-column prop="handout" label="移交" sortable width="80" resizable align="center">
    </el-table-column>
    <el-table-column label="高度" sortable width="80" resizable align="center">
      <template #default="scope">
        <div v-for="(item, index) in scope.row.levels" :key="index">
          {{ item }}
        </div>
      </template>
    </el-table-column>
    <el-table-column prop="handin" label="接收" sortable width="80" resizable align="center">
    </el-table-column>
    <el-table-column prop="type" label="类型" sortable width="80" resizable align="center">
    </el-table-column>
    <el-table-column label="机场" sortable width="80" resizable align="center">
      <template #default="scope">
        <div v-for="(item, index) in scope.row.airports" :key="index">
          {{ item }}
        </div>
      </template>
    </el-table-column>
    <el-table-column label="跑道" sortable width="80" resizable align="center">
      <template #default="scope">
        <div v-for="(item, index) in scope.row.runways" :key="index">
          {{ item }}
        </div>
      </template>
    </el-table-column>
    <el-table-column label="出入点" sortable width="100" resizable align="center">
      <template #default="scope">
        <div v-for="(item, index) in scope.row.gatepoints" :key="index">
          {{ item }}
        </div>
      </template>
    </el-table-column>
    <el-table-column label="外接" sortable width="80" resizable align="center">
      <template #default="scope">
        <div v-for="(item, index) in scope.row.airways" :key="index">
          {{ item }}
        </div>
      </template>
    </el-table-column>
    <el-table-column label="模式" sortable width="100" resizable align="center">
      <template #default="scope">
        <div>双流{{ scope.row.direction[0] }}</div>
        <div>天府{{ scope.row.direction[1] }}</div>
      </template>
    </el-table-column>
    <el-table-column label="受限高度" sortable width="120" resizable align="center">
      <template #default="scope">
        <div v-for="(item, index) in scope.row.restrictedLevels" :key="index">
          {{ item.remark }}: {{ item.levels.join(", ") }}
        </div>
      </template>
    </el-table-column>
    <el-table-column prop="remark" label="备注" sortable width="200" resizable align="center">
    </el-table-column>
  </el-table>
</template>

<script>
import { mapWritableState } from 'pinia'
import useTransferStore from '@/store/transfer';
export default {
  setup() {
    const transferStore = useTransferStore();
    return {
      transferStore,
    }
  },
  computed: {
    ...mapWritableState(useTransferStore, {
      filter: 'filter',
      astoredAtiveTab: 'activeTab',
      raw: 'raw',
      card: 'card',
      table: 'table',
    }),
    // transferStore() {
    //   return this.transfer;
    // },
    sourceData() {
      return this.raw;
    },
    selectedSectors() {
      return this.filter.selectedSectors;
    },
  },
};
</script>